<template>
  <a-spin :spinning="showLoading" tip="导出中" size="large">
    <a-card>
      <a-form layout="inline" :form="form" @submit="handleSubmit">
        <a-form-item label="品牌">
          <a-select
            style="width:200px"
            v-decorator="[
              'brandId',
              {
                rules: [{ required: true, message: '请选择品牌!' }]
              }
            ]"
            placeholder="全部"
          >
            <a-select-option :value="item.weid" v-for="item in brands" :key="item.weid">
              {{ item.name }}
            </a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="类型">
          <a-select
            style="width:200px"
            v-decorator="[
              'sku',
              {
                rules: [{ required: true, message: '请选择类型!' }]
              }
            ]"
            placeholder="全部"
          >
            <a-select-option value="SKU">
              导出条码库存
            </a-select-option>
            <a-select-option value="PRODUCT">
              导出商品库存
            </a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="库存范围">
          <a-checkbox-group
            v-decorator="[
              'warehouseType',
              {
                initialValue: ['QUYU', 'NT'],
                rules: [{ required: true, message: '请选择库存范围!' }]
              }
            ]"
          >
            <a-checkbox value="QUYU">全共享</a-checkbox>
            <a-checkbox value="NT">直营区域共享</a-checkbox>
            <a-checkbox value="DP">千万店</a-checkbox>
            <a-checkbox value="CD">CD类仓</a-checkbox>
            <a-checkbox value="JX">经销商仓</a-checkbox>
          </a-checkbox-group>
        </a-form-item>
        <a-form-item>
          <a-button type="primary" html-type="submit" style="margin-left:10px">导出</a-button>
        </a-form-item>
      </a-form>
    </a-card>
  </a-spin>
</template>
<script>
import { brands } from '../../util/brand'
import { inventoryExport, lx, deleteExport } from '@/api/micromall'
import { exportStore } from '@/api/micromall/tool.js'
import { axios } from '@/utils/request'
import { getAction } from '@/api/manage'
export default {
  data() {
    return {
      brands,
      form: this.$form.createForm(this),
      timer: null,
      showLoading: false
    }
  },
  methods: {
    async exportInventory(values) {
      // const url = inventoryExport + JSON.stringify(values)
      // window.open(url)
      const res = await axios({
        url: inventoryExport,
        method: 'post',
        data: values,
        headers: { responseType: 'blob' }
      })
      // const fileName = '库存'
      let blob = new Blob([res])
      let downloadElement = document.createElement('a')
      let href = window.URL.createObjectURL(blob) //创建下载的链接
      downloadElement.href = href
      downloadElement.download = fileName + '.xlsx' //下载后文件名
      document.body.appendChild(downloadElement)
      downloadElement.click() //点击下载
      document.body.removeChild(downloadElement) //下载完成移除元素
      window.URL.revokeObjectURL(href) //释放掉blob对象
      // if (typeof window.navigator.msSaveBlob !== 'undefined') {
      //   window.navigator.msSaveBlob(new Blob([res], { type: 'application/vnd.ms-excel;charset=utf-8' }), fileName + '.xlsx')
      // } else {
      //   let url = window.URL.createObjectURL(new Blob([res], { type: 'application/vnd.ms-excel;charset=utf-8' }))
      //   let link = document.createElement('a')
      //   link.style.display = 'none'
      //   link.href = url
      //   link.setAttribute('download', fileName + '.xlsx')
      //   document.body.appendChild(link)
      //   link.click()
      //   document.body.removeChild(link) //下载完成移除元素
      //   // window.URL.revokeObjectURL(url) //释放掉blob对象
      // }
    },
    handleSubmit(e) {
      e.preventDefault()
      this.form.validateFields(async (err, values) => {
        if (!err) {
          this.showLoading = true
          values.sku = values.sku === 'SKU'
          const { brandId, sku, warehouseType } = values
          const url = `${inventoryExport}?brandId=${brandId}&sku=${sku}&warehouseType=${warehouseType.toString()}`
          const re = await getAction(url)
          if (re.code == 200) {
            this.timer = setInterval(this.getResult, 1000, re.data)
          } else {
            this.showLoading = false
            this.$message.error(re.msg)
          }
          console.log()
        }
      })
    },
    async getResult(key) {
      const result = await lx({ key })
      console.log(result)
      if (result.code == 200 && JSON.stringify(result.data) !== '{}' ) {
        this.showLoading = false
        clearInterval(this.timer)
        this.timer = null
        window.open(result.data)
        setTimeout(() => {
          deleteExport({key})
        }, 10000)
      }
    }
  }
}
</script>
